<template>
  <a-list :data-source="props.pictureList" item-layout="horizontal">
    <template #renderItem="{ item }">
      <a-list-item-meta
        description="Ant Design, a design language for background applications, is refined by Ant UED Team"
      >
        <template #title>
          <a href="https://www.antdv.com/">{{ item.title }}</a>
        </template>
        <template #avatar>
          <a-avatar :src="item.url" />
        </template>
      </a-list-item-meta>
    </template>
  </a-list>
</template>

<script lang="ts" setup>
import { defineProps, withDefaults } from "vue";

const pictureList = [];

interface Props {
  pictureList: any[];
}

const props = withDefaults(defineProps<Props>(), {
  pictureList: () => [],
});
</script>
